{% extends 'base.html' %}
{% load staticfiles %}
{% block title %}<title>{{ course.name }} - 公开课详情</title>{% endblock %}
{% block custom_bread%}
<section>
	<div class="wp">
		<div class="crumbs">
			<ul>
				<li><a href="{% url 'index' %}">首页</a>></li>
				<li><a href="{% url 'courses:course_list' %}">公开课程</a>></li>
				<li>课程详情</li>
			</ul>
		</div>
	</div>
</section>
{% endblock %}
{% block main_content %}
<section>
	<div class="wp">
		<div class="groupPurchase_detail detail">
			<div class="toppro">
				<div class="left">
					<div class="picbox">
						<div class="tb-booth tb-pic">
							<img width="440" height="445"
								 src="{{ MEDIA_URL }}{{ course.image }}"
								 class="jqzoom"/>
						</div>

					</div>
					<div class="des">
						<h1 title="{{ course.name }}">{{ course.name }}</h1>
						<span class="key">{{ course.describe }}</span>
						<div class="prize">
							<span class="fl">难度：<i class="key">{{ course.get_degree_display }}</i></span>
							<span class="fr">学习人数：{{ course.students }}</span>
						</div>
						<ul class="parameter">
							<li><span class="pram word3">时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;长：</span><span>{{ course.learn_time }}</span></li>
							<li><span class="pram word3">章&nbsp;节&nbsp;数：</span><span>{{ course.lesson_set.count }}</span></li>
							<li><span class="pram word3">课程类别：</span><span title="{{ course.category }}">{{ course.category }}</span></li>
							<li class="piclist"><span class="pram word4">学习用户：</span>
								{% for user_course in course.get_learn_users %}
								<span class="pic">
									<img width="40" height="40" src="{{ MEDIA_URL }}{{ user_course.user.image }}"/>
								</span>
								{% endfor %}
							</li>
						</ul>
						<div class="btns">
							<div class="btn colectgroupbtn" id="jsLeftBtn">
								{% if hav_fav_course %}
								已收藏
								{% else %}
								收藏
								{% endif %}
							</div>
							<div class="buy btn"><a style="color: white" href="{% url 'courses:course_info' course.id %}">开始学习</a></div>
						</div>
					</div>
				</div>
				<div class="right">
					<div class="head">
						<h1>授课机构</h1>
						<p>世界名校，课程权威</p>
					</div>
					<div class="pic">
						<a href="{% url 'organization:org_home' course.course_org.id %}">
							<img width="150" height="80" src="{{ MEDIA_URL }}{{ course.course_org.image }}"/>
						</a>
					</div>
					<a href="{% url 'organization:org_home' course.course_org.id %}">
						<h2 class="center" title="清华大学">{{ course.course_org.name }}</h2>
					</a>
					<div class="btn  notlogin" id="jsRightBtn">
						{% if hav_fav_org %}
						已收藏
						{% else %}
						收藏
						{% endif %}
					</div>
					<div class="clear">
						<ul>
							<li>
								<span>课 &nbsp;程&nbsp; 数：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;   {{ course.course_org.course_set.count }}</span>
							</li>
							<li>
								<span>教 &nbsp;师&nbsp; 数：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  {{ course.course_org.teacher_set.count }}</span>
							</li>
							<li>所在地区：&nbsp;&nbsp;{{ course.course_org.address }}</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<section>
	<div class="wp">
		<div class="list groupPurchase_detail_pro">
			<div class="left layout">
				<div class="head">
					<ul class="tab_header">
						<li class="active">课程详情</li>
					</ul>
				</div>
				<div class="tab_cont tab_cont1">
					{% autoescape off %}
					{{ course.detail }}
					{% endautoescape %}
				</div>
				<div class="tab_cont tab_cont2">
					<div class="comment">
						<div class="comenlist">

						</div>
					</div>
				</div>
			</div>
			<div class="right layout">
				<div class="head">相关课程推荐</div>
				<div class="group_recommend">
					{% for course in relate_courses %}
					<dl>
						<dt>
							<a target="_blank" href="">
								<img width="240" height="220" class="scrollLoading"
									 src="{{ MEDIA_URL }}{{ course.image }}"/>
							</a>
						</dt>
						<dd>
							<a target="_blank" href=""><h2>{{ course.name }}</h2></a>
							<span class="fl">学习时长：<i class="key">{{ course.learn_time }}</i></span>
						</dd>
					</dl>
					{% endfor %}
				</div>
			</div>
		</div>
	</div>
</section>
{% endblock %}
{% block custom_js%}
<script type="text/javascript">
//收藏分享
function add_fav(current_elem, fav_id, fav_type){
    $.ajax({
        cache: false,
        type: "POST",
        url:"{% url 'organization:add_fav' %}",
        data:{'fav_id':fav_id, 'fav_type':fav_type},
        async: true,
        beforeSend:function(xhr, settings){
            xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");
        },
        success: function(data) {
            if(data.status == 'fail'){
                if(data.msg == '用户未登录'){
                    window.location.href="{% url 'login' %}?next={{ request.path }}";
                }else{
                    alert(data.msg)
                }

            }else if(data.status == 'success'){
                current_elem.text(data.msg)
            }
        },
    });
}

$('#jsLeftBtn').on('click', function(){
    add_fav($(this), {{ course.id }}, 1);
});

$('#jsRightBtn').on('click', function(){
    add_fav($(this), {{ course.course_org.id }}, 2);
});


</script>
{% endblock %}